<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="shortcut icon" href="__IMG__/favicon.ico" />
		<link rel="bookmark" href="__IMG__/favicon.ico" type="image/x-icon" 　/>
		<title>银行卡充值</title>
		<link rel="stylesheet" type="text/css" href="__CSS__/mui.min.css"/>
		<link rel="stylesheet" type="text/css" href="__CSS__/common.css"/>
		<script src="__JS__/mui.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" charset="utf-8">
	      	mui.init();
        </script>
        <style type="text/css">
			input[type=text]{
				font-size:12px;
				width: 80%;
				height:33px;
			}
            input[type=button]{
            	width: 200px;
            	text-align: center;
            	color: #fff;
            	border: none;
            }
			.next_a{
				width: 200px;
				height: 40px;
				background: url(__IMG__/bg_inp.png)no-repeat;
				background-size:100% 100% ;
				color: #fff;
				line-height: 40px;
				text-align: center;
				margin-top: 20px;
			}
			.btn{
				line-height: 33px;
			}
        </style>
	</head>
	<body class="bg_ff">
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">银行卡充值</h1>
		</header>
		<div class="mui-content bg_ff">
		   <div class="padding_10">
			   <p>
				   <label for="">转账银行：</label>
				   <select name="bank" id="bank">
					   <option value="0">请选择转账</option>
					   {foreach $bank as $k=>$v}
					   <option value="{$v['bank']}" {if $v['bank']==$data['k_bank']} selected{/if}>{$v['bank']}</option>
					   {/foreach}
				   </select>
				   <i style="position: absolute;top: 60px;right: 20px;width: 12px;height: 8px;background: url(__IMG__/down.png)no-repeat;"></i>
			   </p>
			   <p style="text-align: center">
				   <label for="" id="first">{$data['k_bank']}</label>
			   </p>
			   <p>
				   <label for="">银行账号：</label>
				   <input type="text" name="" id="account_bank" value="{$data['k_card_number']}" readonly="readonly" />
				   <button class="btn" data-clipboard-action="copy" data-clipboard-target="#account_bank">复制</button>
			   </p>
			   <p>
				   	<label for="">开户姓名：</label>
				   	<input type="text"  id="username" value="{$data['k_name']}" readonly="readonly"  />
				    <button class="btn" data-clipboard-action="copy" data-clipboard-target="#username">复制</button>
				    <input type="hidden" name="way" id="way"  value="3" />
			   </p>
			   <p>
				   <label for="">开户支行：</label>
				   <input type="text" name="" id="branch_bank" value="{$data['k_branch']}" readonly="readonly"  />
				   <button class="btn" data-clipboard-action="copy" data-clipboard-target="#branch_bank">复制</button>
			   </p>
			   <p>
				   <label for="">充值金额：</label>
				   <input type="text"  id="money" value="" />
			   </p>
			   <p>
				   <label for="">转卡姓名：</label>
				   <input type="text"  id="name" value="{$true_name|default=''}" />
			   </p>


			   <p class="text-center mg_top40">
				   <a href="#" id="tj" class="next_a">确认充值</a>
			   </p>
		   </div>
		</div>
	</body>
	<script src="__JSA__/jquery-1.10.2.min.js"></script>
	<script src="__JS__/clipboard.min.js" ></script>
	<script src="__JS__/layer.js" ></script>
	<script src="__JS__/rooms.js" ></script>
	<script>

        $('#bank').change(function(){
            var k_bank=$(this).children('option:selected').val();//这就是selected的值
            $.ajax({
                type: "post",
                url: "{:url('recharge/get_bank_one')}",
                data: {
                    "bank": k_bank
                },
                dataType: "json",
                async: false,
                success: function(data) {
                    var ret          = data.ret;
                    var k_bank       = data.data.k_bank;
                    var account_bank = data.data.k_card_number;
                    var k_name       = data.data.k_name;
                    var branch_bank  = data.data.k_branch;
                    if(ret=='200'){
                     $('#first').html(k_bank);
					 $('#username').val(k_name);
					 $('#account_bank').val(account_bank);
					 $('#branch_bank').val(branch_bank);
                    }
                }
            });
        });
        $('#tj').click(function () {
            var name       = $('#name').val();
            var money      = $('#money').val();
            var remark     = $('#bank option:selected').val();
            if(name==""){
                 my_error('请填写姓名');
                return false;
            }
            if(money==""){
                 my_error('请填写充值金额');
                return false;
            }
            if(remark=="" || remark==0){
                 my_error('请选择转账银行');
                return false;
            }
            $.ajax({
                type: "post",
                url: "{:url('recharge/offline_charge')}",
                data: {
                    "name": name,
                    'remark': remark,
                    'money': money,
                    'way':3
                },
                dataType: "json",
                async: false,
                success: function(data) {
                    var ret = data.ret;
                    var msg = data.msg;
                    if(ret=='200'){
                         my_error(msg);
                    }else{
                         my_error(msg);
                    }
                }
            });
        })
	</script>
	<script>
        var clipboard = new Clipboard('.btn');
        clipboard.on('success', function(e) {
            my_error('复制成功')
        });

        clipboard.on('error', function(e) {
            my_error('复制失败')
        });
	</script>
</html>
